import {Object3D,Vector2} from 'three';
import UIMesh from './ui-mesh';
import UIMaterial from './ui-material';
import UIInline from './ui-inline';
import UIBox from './ui-box';
import Mix from '../../general/mix';
import UIFrame from './ui-frame';
import Constant from './ui-constant';

export default class UIInlineBlock extends Mix(Object3D)(UIBox,UIInline,UIMaterial,UIMesh){
    constructor(options={}){
        super( options );
        this.isInlineBlock = true;
        this.size = new Vector2( 1, 1 );
        this.tSize = new Vector2( 1, 1 );
        this.frame = new UIFrame( this.getBackgroundMaterial() );
        this.frame.onBeforeRender = () => {
            if ( this.updateClippingPlanes ) {
                this.updateClippingPlanes();
            }
        };
        this.add( this.frame );
        this.set( options );
    }

    get uiType(){
        return Constant.TYPE_INLINE_BLOCK;
    }

    parseParams() {
        this.inlines = [ {
            height: this.height || 0.3,
            width: this.width || 0.3,
            anchor: 0,
            lineBreak: Constant.VALUE_POSSIBLE,
        } ];
    }
    updateInner() {
        this.position.z = this.getOffset();
        if ( this.frame ) this.updateBackgroundMaterial();
    }
    updateLayout() {
        const WIDTH = this.getWidth();
        const HEIGHT = this.getHeight();
        if ( this.inlines ) {
            const options = this.inlines[0];
            this.position.set( options.width / 2, options.height / 2, 0 );
            this.position.x += options.offsetX||0;
            this.position.y += options.offsetY||0;
        }
        this.size.set( WIDTH, HEIGHT );
        this.frame.scale.set( WIDTH, HEIGHT, 1 );
        if ( this.frame ) this.updateBackgroundMaterial();
        this.frame.renderOrder = this.getParentsNumber();
        if ( this.children.find( child => child.isInline ) ) {
            this.computeInlinesPosition();
        }
        this.computeChildrenPosition();
        this.position.z = this.getOffset();
    }

}